Ext.ns('Tm.user');
Tm.user.UserIndexPanel = Ext.extend(Ext.Panel, {
	frame : true,
	autoWidth : true,
	// autoHeight : true,
	layout : 'fit',
	initComponent : function() {

		var form = new Tm.common.FormPanel({
			layout : 'table',
			layoutConfig : {
				columns : 3
			},
			defaults : {
				xtype : 'textfield',
				margins : '0 5 0 0'
			},
			items : [ {
				plugins : [ Ext.ux.FieldLabeler ],
				name : 'name',
				fieldLabel : '用户姓名'
			}, {

				plugins : [ Ext.ux.FieldLabeler ],
				name : 'account',
				fieldLabel : '用户账号'
			}, {

				plugins : [ Ext.ux.FieldLabeler ],
				name : 'contact',
				fieldLabel : '联系方式'
			}, {

				plugins : [ Ext.ux.FieldLabeler ],
				name : 'enable',
				fieldLabel : '是否启用',
				//width:150,
				xtype : 'combo',
				mode : 'local',
				typeAhead : true,
				forceSelection : true,
				mode : 'local',
				triggerAction : 'all',
				emptyText : '请选择...',
				selectOnFocus : true,
				store : Tm.data.userStates
			//	colspan : 3
			}, {
				plugins : [ Ext.ux.FieldLabeler ],
				//allowBlank:false,
				//msgTarget: 'title',
				xtype : 'superboxselect',
				fieldLabel : '拥有角色',
				resizable : true,
				name : 'roles',
				width : 445,
				//anchor:'100%',
				store : new Ext.data.JsonStore({
					url : 'role/getAllRoles.do',
					autoLoad : true,
					fields : [ {
						name : 'id'
					}, {
						name : 'name'
					} ]
				}),
				mode : 'local',
				displayField : 'name',
				displayFieldTpl : '{name}',
				valueField : 'id',
				navigateItemsWithTab : true,
				colspan : 2
			} ]
		});

		var cm = new Ext.grid.ColumnModel([ {
			header : 'id',
			dataIndex : 'id',
			hidden : true
		}, {
			header : '用户账号',
			width : 100,
			dataIndex : 'account',
			sortable : true
		}, {
			header : '用户姓名',
			width : 80,
			dataIndex : 'name',
			sortable : true
		}, {
			header : '移动电话',
			width : 100,
			dataIndex : 'mobile',
			sortable : true
		}, {
			header : '邮箱',
			width : 100,
			dataIndex : 'email',
			sortable : true
		}, {
			header : '是否启用',
			width : 40,
			dataIndex : 'enable',
			//align : 'center',
			xtype : 'combocolumn',
		    editor: new Ext.form.ComboBox({
				name : 'enable',
				fieldLabel : '是否启用',
				mode : 'local',
				editable : false,
				typeAhead : true,
				forceSelection : true,
				hiddenName : 'enable',
				mode : 'local',
				triggerAction : 'all',
				emptyText : '请选择...',
				selectOnFocus : true,
				store : Tm.data.userStates,
				allowBlank : false
			}),
			sortable : true
			
		}, {
			header : '创建日期',
			width : 100,
			renderer : Ext.util.Format.customDateRenderer('Y-m-d'), 
			dataIndex : 'createTime'
		} , {
			header : '最后登录时间',
			width : 150,
			renderer : Ext.util.Format.customDateRenderer('Y-m-d H:i:s'), 
			dataIndex : 'lastLoginTime'
		} ]);
		cm.defaultSortable = true;
		var fields = [ {
			name : 'id',
			type : 'int',
			mapping : 'id'
		}, {
			name : 'account',
			type : 'string',
			mapping : 'account'
		}, {
			name : 'email',
			type : 'string',
			mapping : 'email'
		}, {
			name : 'mobile',
			type : 'string',
			mapping : 'mobile'
		}, {
			name : 'email',
			type : 'string',
			mapping : 'email'
		}, {
			name : 'name',
			type : 'string',
			mapping : 'name'
		}, {
			name : 'enable',
			type : 'string',
			mapping : 'enable',
			editor : new Ext.form.ComboBox({
				name : 'enable',
				fieldLabel : '是否启用',
				mode : 'local',
				editable : false,
				typeAhead : true,
				forceSelection : true,
				hiddenName : 'enable',
				mode : 'local',
				triggerAction : 'all',
				emptyText : '请选择...',
				selectOnFocus : true,
				store : Tm.data.userStates,
				allowBlank : false
			})
		}, {
			name : 'createTime',
			type : 'string',
			mapping : 'createTime'
		} , {
			name : 'lastLoginTime',
			type : 'string',
			mapping : 'lastLoginTime'
		} ];
		var ds = new Ext.data.Store({
			id : 'userIndexPanelGridPanelStore',
			proxy : new Ext.data.HttpProxy({
				url : 'user/queryUser.do'
			}),
			reader : new Ext.data.JsonReader({
				totalProperty : 'totalProperty',
				root : 'root',
				id : 'id',
				fields : fields
			}),
			baseParams : {
				start : 0,
				limit : 20
			},
//			sortInfo : {
//				field : 'id',
//				direction : 'ASC'
//			},
			autoLoad : true,
			listeners : {
				beforeload : function() {
					Ext.apply(this.baseParams, form.getForm().getFieldValues(
							false));
				}
			}
		}

		);

		var grid = new Ext.grid.GridPanel({
			store : ds,
			cm : cm,
			border : false,
			stripeRows : true,
			autoHeight : true,
			viewConfig : {
				forceFit : true
			},
			bbar : new Ext.PagingToolbar({
				plugins : new Ext.ux.ProgressBarPager(),
				pageSize : 20,
				store : ds,
				displayInfo : true,
				emptyMsg : '没有记录'
			}),

			listeners : {
				celldblclick : function(grid, rowIndex, columnIndex, event) {
					var store = grid.getStore();
					var data = store.getAt(rowIndex).data;
					var userUpdatePanel = new Tm.user.UserAddPanel({
						dataId : data.id
					});
					var userAddWindow = new Tm.common.CommonWindow({
						id : 'userAddWindow',
						title : '更新用戶',
						width : 300,
						height : 400,
						plain : true,
						items : userUpdatePanel
					});
					userAddWindow.on('close', function(panel) {
						ds.load();
					});
					userAddWindow.show();

				}
			}
		});
		var toolBar = new Ext.Toolbar({
			hideBorders : true,
			buttons : [ {
				text : '查询',
				iconCls : 'act_queryIcon',
				handler : function() {
					ds.load();
				}
			}, {
				xtype : 'tbseparator'
			}, {
				text : '重置',
				iconCls : 'act_resetIcon',
				handler : function() {
					form.getForm().reset();
				}
			}, {
				xtype : 'tbseparator'
			}, {
				text : '新增',
				iconCls : 'act_addIcon',

				handler : function() {
					var userAddPanel = new Tm.user.UserAddPanel();
					var userAddWindow = new Tm.common.CommonWindow({
						id : 'userAddWindow',
						title : '新增用戶',
						width : 300,
						height : 400,
						plain : true,
						// bodyStyle : 'padding:5px;',
						items : userAddPanel
					});
					userAddWindow.on('close', function(panel) {
						ds.load();
					});
					userAddWindow.show();

				}
			} ]
		});
		Ext.apply(this, {
			tbar : toolBar,
			items : [ form, grid ]
		});
		Tm.user.UserIndexPanel.superclass.initComponent.call(this);
	}
});
